<template>
	<view>
		<view>
			<div id="app">
				<!--为echarts准备一个具备大小的容器dom-->
					<div id="main" style="width: 600px; height: 400px"></div>
				</div>
				<view>
					<u-tabbar v-model="current" :active-color="activeColor" :list="tabBerList"></u-tabbar>
				</view>
			</view>
		<view>
			<u-tabbar v-model="current" :active-color="activeColor" :list="tabBerList" ></u-tabbar>
		</view>
	</view>	
</template>

<script>
	import * as echarts from "echarts"
	import {mapState} from 'vuex'
	export default {
		data() {
			return {
				borderTop: false,
				activeColor: '#17abe3',
				current:3,
				charts: "",
				opinionData: ["30", "20", "25", "40", "50","40","20"],
			}
		},
		onLoad() { //option为object类型，会序列化上个页面传递的参数
			this.$store.commit('setRoleId',0)
		    uni.getStorageSync('account')
		},
		computed: {
			...mapState(['tabBerList',])
		},
		methods: {
				    drawLine(id) {
				      this.charts = echarts.init(document.getElementById(id));
				      this.charts.setOption({
				        tooltip: {
				          trigger: "axis",
				        },
				        legend: {
				          data: ["近五日操作次数统计"],
				        },
				        grid: {
				          left: "4%",
				          right: "35%",
				          bottom: "3%",
				          containLabel: true,
				        },
				 
				        toolbox: {
				          feature: {
				            saveAsImage: {},
				          },
				        },
				        xAxis: {
							name:"单位（天 ）",
				          type: "category",
				          boundaryGap: false,
				          data: ["1", "2", "3", "4", "5","6","7"],
				        },
				        yAxis: {
							name:"单位（次）",
				          type: "value",
				        },
				 
				        series: [
				          {
				            name: "近五日操作次数统计",
				            type: "line",
				            stack: "总量",
				            data: this.opinionData,
				          },
				        ],
				      });
				    },
				  },
				  //调用
				  mounted() {
				    this.$nextTick(function () {
				      this.drawLine("main");
				    });
				  },
				};
			
		</script>

<style lang="scss">

</style>
